<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/css/public.css" media="all">
    <script src="/bootstrap3/jquery-3.6.3.js" ></script>
    <script src="/lib/layui-v2.6.3/layui.js"></script>
    <title>药材添加</title>
    <style>
        /*body {*/
        /*    background-color: white;*/
        /*}*/
    </style>
</head>
<body>
<div class="layuimini-main" style="background-color: white">
    <fieldset
            class="layui-elem-field layui-field-title"
            style="margin-top: 20px"
    >
        <legend>药材添加</legend>
    </fieldset>
    <div class="layui-form layuimini-form" action="" style="background-color: white">
        <div class="layui-row">
            <div class="layui-col-sm4">
                <div class="layui-form-item" style="margin-top: 30px">
                    <label class="layui-form-label">图片上传</label>
                    <div class="layui-input-inline">
                        <div class="layui-row">
                            <div class="layui-upload-list layui-col-sm6">
                                <img
                                        class="layui-upload-img"
                                        style="height: 200px;width: 150px;border: 1px black solid;"
                                        id="demo1"
                                />
                                <p id="demoText" name="picture" style="display: none"></p>
                            </div>
                            <div class="layui-col-sm1 layui-col-sm-offset5" style="height: 200px">
                                <button
                                        class="layui-btn-sm layui-btn"
                                        style="margin-top: 180px"
                                        id="upload1"
                                >
                                    <i class="layui-icon">&#xe67c;</i>点击上传
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6">
                <!-- <div class="layui-form-item"> -->
                <div class="layui-form-item">
                    <label class="layui-form-label required">中文名</label>
                    <div class="layui-input-block">
                        <input
                                type="text"
                                name="zhname"
                                id="zhname"
                                lay-verify="required"
                                lay-reqtext="请输入中文名"
                                autocomplete="off"
                                placeholder="请输入中文名"
                                class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label required">苗药名</label>
                    <div class="layui-input-block">
                        <input
                                type="text"
                                id="miaoname"
                                name="miaoname"
                                lay-verify="required"
                                lay-reqtext="请输入苗药名"
                                autocomplete="off"
                                placeholder="请输入苗药名"
                                class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">药材俗名</label>
                    <div class="layui-input-block">
                        <input
                                type="text"
                                name="suname"
                                id="suname"
                                lay-verify="required"
                                lay-reqtext="请输入俗名"
                                autocomplete="off"
                                placeholder="请输入俗名"
                                class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label required">英文名</label>
                    <div class="layui-input-block">
                        <input
                                type="text"
                                name="enname"
                                id="enname"
                                lay-verify="required"
                                lay-reqtext="请输入英文名"
                                autocomplete="off"
                                placeholder="请输入英文名"
                                class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label required">拉丁名</label>
                    <div class="layui-input-block">
                        <input
                                type="text"
                                name="latinname"
                                id="latinname"
                                lay-verify="required"
                                lay-reqtext="请输入拉丁名"
                                autocomplete="off"
                                placeholder="请输入拉丁名"
                                class="layui-input"
                        />
                    </div>
                </div>
                <!-- </div> -->
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">苗药类型</label>
            <div class="layui-input-inline">
                <select name="miao_type" id="miaoType" class="layui-select" lay-search>
                    <option value="解表药">解表药</option>
                    <option value="清热药">清热药</option>
                    <option value="止血药">止血药</option>
                    <option value="祛风湿药">祛风湿药</option>
                    <option value="泻下药">泻下药</option>
                    <option value="补虚药">补虚药</option>
                    <option value="收涩药">收涩药</option>
                    <option value="安神药">安神药</option>
                </select>
            </div>
            <label class="layui-form-label required">入药部位</label>
            <div class="layui-input-inline" style="width: 50%">
                <input
                        type="text"
                        id="usePart"
                        placeholder="请输入入药部位"
                        lay-verify="required"
                        lay-reqtext="输入入药部位"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">药用来源</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="pharmSrc"
                        id="pharmSrc"
                        lay-verify="required"
                        lay-reqtext="请输入药用来源"
                        autocomplete="off"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">药性</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="natureFlavor"
                        id="natureFlavor"
                        lay-verify="required"
                        lay-reqtext="输入药性"
                        placeholder="请输入药性"
                        autocomplete="off"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">归经</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="belongLection"
                        id="belongLection"
                        placeholder="请输入归经"
                        lay-verify="required"
                        lay-reqtext="输入归经"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">毒性</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="toxicity"
                        id="toxicity"
                        placeholder="请输入药材毒性"
                        lay-verify="required"
                        lay-reqtext="请输入毒性"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">质征</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="zhizheng"
                        id="zhizheng"
                        placeholder="请输入质征"
                        lay-verify="required"
                        lay-reqtext="质征不能为空"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">走关</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="zhouguan"
                        id="zhouguan"
                        placeholder="请输入走关"
                        lay-verify="required"
                        lay-reqtext="输入走关"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">入架</label>
            <div class="layui-input-block" style="width: 80%">
                <input
                        type="text"
                        name="rujia"
                        id="rujia"
                        placeholder="请输入内容"
                        lay-verify="required"
                        lay-reqtext="入架不能为空"
                        class="layui-input"
                />
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">主治</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="majorFun"
                    id="majorFun"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="入架不能为空"
            ></textarea>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">功效</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="efficacy"
                    id="efficacy"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="入架不能为空"
            ></textarea>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">用法用量</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="usedosage"
                    id="usedosage"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="入架不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">验方</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="provedRecipe"
                    id="provedRecipe"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="验方不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">采收加工</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="pickProcess"
                    id="pickProcess"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="采收信息不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">药材鉴别</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="pharmIdentify"
                    id="pharmIdentify"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="鉴别信息不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">化学成分</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    id="chemComponent"
                    name="chemComponent"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="化学成分不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">药理作用</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="pharmAction"
                    id="pharmAction"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="药理作用内容不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">植物库来源</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="plantsSrc"
                    id="plantsSrc"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="来源信息不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">植物源形态</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="plantsForm"
                    id="plantsForm"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="形态信息不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">产地分布</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="origin"
                    id="origin"
                    placeholder="请介绍产地信息"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="产地分布信息不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">临床研究</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="curResearch"
                    id="curResearch"
                    placeholder="请输入内容"
                    class="layui-textarea"
                    lay-verify="required"
                    lay-reqtext="临床研究内容不能为空"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block" style="width: 80%">
            <textarea
                    name="member"
                    id="member"
                    placeholder="请输入内容"
                    class="layui-textarea"
            ></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button
                        class="layui-btn layui-btn-normal"
                        lay-filter="saveBtn"
                        lay-submit
                        id="saveBtn"
                        style="margin-bottom: 20px"
                >
                    保存
                </button>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    layui.use('upload', function () {
        upload = layui.upload
        var $=layui.$;
        var form=layui.form
        var table=layui.table;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#upload1', //绑定元素
            url: '/miaosample/uploadImage', //上传接口
            before: function (obj) {
                //预读本地文件示例
                obj.preview(function (index, files, result) {
                    console.log(result)
                    $('#demo1').attr('src', result) //图片链接（base64）
                })
            },
            done: function (res) {
                //如果上传失败
                if (res) {
                    //上传成功
                    layer.alert('上传成功' + res.data.url)
                    imgurl=res.data.url;
                    //document.getElementById('pic').value = res.url
                    $("#demoText").html(imgurl)
                } else {
                    return layer.msg('上传失败')
                }
            },
        });
        var session=window.sessionStorage;
        var imgurl=session.getItem("picture");
        $("#zhname").val(session.getItem("zhname"));
        $("#miaoname").val(session.getItem("miaoname"));
        $("#enname").val(session.getItem("enname"));
        $("#suname").val(session.getItem("suname"));
        $("#latinname").val(session.getItem("latinname"));
        $("#plantsSrc").val(session.getItem("plantsSrc"));
        $("#origin").val(session.getItem("origin"));
        $("#pharmSrc").val(session.getItem("pharmSrc"))
        $("#plantsForm").val(session.getItem("plantsForm"));
        $("#usePart").val(session.getItem("usePart"));
        $("#miaoType").val(session.getItem("miaoType"));
        $("#natureFlavor").val(session.getItem("natureFlavor"));
        $("#belongLection").val(session.getItem("belongLection"));
        $("#toxicity").val(session.getItem("toxicity"));
        $("#zhizheng").val(session.getItem("zhizheng"));
        $("#zhouguan").val(session.getItem("zhouguan"));
        $("#rujia").val(session.getItem("rujia"));
        $("#majorFun").val(session.getItem("majorFun"));
        $("#efficacy").val(session.getItem("efficacy"));
        $("#usedosage").val(session.getItem("usedosage"));
        $("#provedRecipe").val(session.getItem("provedRecipe"));
        $("#pickProcess").val(session.getItem("pickProcess"));
        $("#pharmIdentify").val(session.getItem("pharmIdentify"));
        $("#chemComponent").val(session.getItem("chemComponent"));
        $("#pharmAction").val(session.getItem("pharmAction"));
        $("#curResearch").val(session.getItem("curResearch"));
        $("#member").val(session.getItem("member"));
        $("#demo1").attr("src", "/imgs/" +imgurl)
        //图片预览
        $("#demo1").click(function (){
            var img = new Image(400,400);
            img.src =$("#demo1").attr("src");
            var height=img.height,width=img.width;
            if(img.height > 600) {
                height = 'auto';
                width=(600/(img.height))*(img.width);
            }

            var imgHtml = "<img src='" + $("#demo1").attr("src") + "' height='"+height+"' width='"+width+"' />";
            //弹出层
            layer.open({
                type: 1,
                 offset: 'auto',
                 area: [width,height],
                shadeClose:true,//点击外围关闭弹窗
                scrollbar: false,//不现实滚动条
                title: "图片预览", //不显示标题
                content: imgHtml, //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响
                resize:false,
                cancel: function () {//取消之后的一些操作（点击X）

                }
            });
        });
        form.render("select")
        $("#saveBtn").click(function(){
            if(""!=$("#zhname").val()&&""!=$("#miaoname").val()
                &&""!=$("#enname").val()&&""!=$("#suname").val()
                &&""!=$("#latinname").val()&&imgurl!=null
                &&""!=$("#plantsSrc").val()&&""!=$("#origin").val()
                &&""!=$("#pharmSrc").val()&&""!=$("#plantsForm").val()&&""!=$("#usePart").val()&&""!=$("#miaoType").val()
                &&""!=$("#natureFlavor").val()&&""!=$("#belongLection").val()&&""!=$("#toxicity").val()&&""!=$("#zhizheng").val()&&""!=$("#zhouguan").val()
                &&""!=$("#rujia").val()
                &&""!=$("#majorFun").val()&&""!=$("#efficacy").val()&&""!=$("#usedosage").val()&&""!=$("#provedRecipe").val()
                &&""!=$("#pickProcess").val()&&""!=$("#pharmIdentify").val()&&""!=$("#chemComponent").val()&&""!=$("#pharmAction").val()&&""!=$("#curResearch").val()) {
                $.ajax({
                    url: '/miaosample/update',
                    type: 'POST',
                    data: {
                        "id": session.getItem("id"),
                        "zhname": $("#zhname").val(),
                        "miaoname": $("#miaoname").val(),
                        "enname": $("#enname").val(),
                        "suname": $("#suname").val(),
                        "latinname": $("#latinname").val(),
                        "picture": imgurl + "",
                        "plantsSrc": $("#plantsSrc").val(),
                        "origin": $("#origin").val(),
                        "pharmSrc": $("#pharmSrc").val(),
                        "plantsForm": $("#plantsForm").val(),
                        "usePart": $("#usePart").val(),
                        "miaoType": $("#miaoType").val(),
                        "natureFlavor": $("#natureFlavor").val(),
                        "belongLection": $("#belongLection").val(),
                        "toxicity": $("#toxicity").val(),
                        "zhizheng": $("#zhizheng").val(),
                        "zhouguan": $("#zhouguan").val(),
                        "rujia": $("#rujia").val(),
                        "majorFun": $("#majorFun").val(),
                        "efficacy": $("#efficacy").val(),
                        "usedosage": $("#usedosage").val(),
                        "provedRecipe": $("#provedRecipe").val(),
                        "pickProcess": $("#pickProcess").val(),
                        "pharmIdentify": $("#pharmIdentify").val(),
                        "chemComponent": $("#chemComponent").val(),
                        "pharmAction": $("#pharmAction").val(),
                        "curResearch": $("#curResearch").val(),
                        "member": $("#member").val()
                    },
                    async: true,
                    dataType: "json",
                    success: function (data) {
                        if (data) {
                            //window.location.href="/page/yaocai_list.html";//当保存成功之后就跳转到药材基本信息列表。
                            var index = parent.layer.getFrameIndex(window.name);
                            // layer.alert("修改成功", function () {
                            //     setTimeout(function () {
                            //         parent.layer.close(index)
                            //     }, 500)
                            // })
                            layer.msg("修改成功",
                                {
                                    icon:1,
                                    time:500
                                },
                                function () {
                                parent.layer.close(index);
                                table.reload('currentTableId');
                            });
                            //setTimeout(function () { parent.layer.close(index) }, 1000)
                        } else {
                            layer.msg("修改出错",
                                {
                                    icon:2,
                                    time:500
                                });
                        }
                    }
                })
            }
    });
    });
</script>
</html>
